<template>
	<div>
		<!-- header子组件发过来的要在header标签上接收 -->
		<!-- $event为子组件传过来的参数,固定写成$event,不能改 -->
		<classify-header :list="lists" v-on:thisChild="thisChild($event)"></classify-header>
		<classify-list :list="listls"></classify-list>	
	</div>
</template>

<script>
import ClassifyList from './components/List'
import ClassifyHeader from './components/Header'

import axios from 'axios'
export default {
	name: 'Classify',
	components: {
		ClassifyList,
		ClassifyHeader,
	},
	data () {
		return {
			lists: [],
			listls: [],
			classlist: [],	
			classarr: [],
			listlsx: [],

			index:0,
			ntsum:0,
			amsum:0,
			fmsum:0,
			ossum:0,					
		}
	},
	methods: {
		getClassifyInfo () {
			axios.get('/api/detail.json')
				.then(this.handleGetClassifyInfoSucc)
		},
		handleGetClassifyInfoSucc (res) {
			res = res.data
			if (res.ret && res.data) {
				const data = res.data
				this.lists = data.classify
				this.listls = data.classify
			}
		},
		thisChild (val) {
			this.el = val
			const self = this
			if (val == 0) {	
				this.listls = this.lists
			}
			if (val == 1) {	
				this.listlsx.length = 0	
				self.lists.forEach(i=>{
					if (i.natural == 'naturalzoo') {				
						this.listlsx.push(i)						
					} 
				})
				this.listls = this.listlsx
			}
			if (val == 2) {	
				this.listlsx.length = 0	
				self.lists.forEach(i=>{
					if (i.natural == 'sparkzoo') {					
						this.listlsx.push(i)
					} 										
				})
				this.listls = this.listlsx
			}
			if (val == 3) {	
				this.listlsx.length = 0	
				self.lists.forEach(i=>{
					if (i.amusement == 'childzoo') {				
						this.listlsx.push(i)
					} 			
				})
				this.listls = this.listlsx					
			}
			if (val == 4) {		
				this.listlsx.length = 0	
				self.lists.forEach(i=>{
					if (i.amusement == 'themezoo') {				
						this.listlsx.push(i)
					} 						
				})
				this.listls = this.listlsx					
			}
			if (val == 5) {	
				this.listlsx.length = 0		
				self.lists.forEach(i=>{
					if (i.formalfun == 'formalzoo') {				
						this.listlsx.push(i)
					} 						
				})
				this.listls = this.listlsx					
			}
			if (val == 6) {	
				this.listlsx.length = 0		
				self.lists.forEach(i=>{
					if (i.oceanpark == 'oceanzoo') {			
						this.listlsx.push(i)
					} 						
				})
				this.listls = this.listlsx					
			}
			if (val == 7) {		
				this.listlsx.length = 0	
				self.lists.forEach(i=>{
					if (i.oceanpark == 'waterzoo') {				
						this.listlsx.push(i)
					} 	
				})
				this.listls = this.listlsx					
			}						
		},
	},
	mounted () {
		this.getClassifyInfo()
	},
}
</script>

<style lang='stylus' scoped>

</style>